<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-title" content="标题"> <!-- 添加到主屏后的标题（iOS 6 新增） -->
    <meta name="apple-mobile-web-app-capable" content="yes"><!-- 是否启用 WebApp 全屏模式 -->
    <meta name="apple-mobile-web-app-status-bar-style" content="white-translucent">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>申请试用-搜索试用</title>
    <link rel="stylesheet" href="../../css/mobile_reset.css">
    <link rel="stylesheet" href="../../css/mui.css">
    <link rel="stylesheet" href="../../css/search_goods.css">
    <link rel="stylesheet" href="../../css/modal_alert.css">
    <script>
        (function () {
            document.addEventListener('DOMContentLoaded', function () {
                var html = document.documentElement;
                var windowWidth = html.clientWidth;
                html.style.fontSize = windowWidth / 7.5 + 'px';
                // 等价于html.style.fontSize = windowWidth / 750 * 100 + 'px';
            }, false);
        })();

        // 这个7.5就是根据设计稿的横向宽度来确定的，假如你的设计稿是640
        // 那么 html.style.fontSize = windowWidth / 6.4 + 'px';
    </script>
</head>
<body>
<div class="nav">
    <img src="../../images/det_bg_lqone_default.png" alt="">
</div>
<!--搜索筛选关键词-->
<div class="search_keyword">
    <p class="step">
        <img src="../../images/lqsy_bg_one_default.png" alt="">
    </p>
    <p class="title">复制淘口令</p>
    <div class="content">
        <p>1.请先复制下面的淘口令</p>
        <p>2.复制成功后打开手机淘宝，即可看到商品</p>
        <p class="taokl_box">
            <textarea name="" id="" cols="30" rows="10">

            </textarea>
        </p>
    </div>
        <p class="copy_taokl"><input type="button" value="查看新的关键词"></p>
</div>
<!--根据详细信息寻找商品-->
<div class="search_goods">
    <p class="step">
        <img src="../../images/lqsy_bg_two_default.png" alt="">
    </p>
    <p class="title">根据详细信息寻找商品</p>
    <div class="content">
        <p>请根据以下提示找到试用商品：</p>
        <p class="images01"><img src="../../images/det_bg_sp_default.png" alt=""></p>
        <p>商品价格 <span>&yen;300</span></p>
        <p>商家店铺旺旺ID：<span>Mx123456789</span></p>
    </div>
</div>
<!--核对商品-->
<div class="check_goods">
    <p class="step">
        <img src="../../images/lqsy_bg_three_default.png" alt="">
    </p>
    <p class="title">核对商品</p>
    <div class="content">
        <p>请按照下图所示，将宝贝的分享信息，</p>
        <p>粘贴在下面的输入框进行商品核对。</p>
        <p class="images02"><img src="../../images/tyr03.png" alt=""></p>
        <p><textarea  placeholder="请将商品分享信息粘贴到此" ></textarea></p>

    </div>
</div>
<p class="submit_btn">
    <input class="affirm_submit" type="submit" value="核对商品并进入下一步">
</p>

<div class="modal_box">
    <div class="modal_content">
        <p class="hint">
            <span>提示</span>
            <img class="close" src="../../images/tc_icon_off_default.png" alt=""></p>
        <p class="main">商品不正确，请再认真按照上述步骤寻找！</p>
        <p class="confirm">
            <input type="button" value="确定">
        </p>
    </div>
    <div class="mask_layer"></div>
</div>
<div class="modal_box_keyword" style="display:none;">
    <div class="modal_content">
        <p class="hint">
            <span>提示</span>
            <img class="close" src="../../images/tc_icon_off_default.png" alt=""></p>
        <p class="main">确认花<span style="color:#2c8ee5;">5个夺宝币</span>查看关键词吗？</p>
        <p class="btns">
            <input type="button" value="确定">
            <input class="close" type="button" value="取消">
        </p>
    </div>
    <div class="mask_layer"></div>
</div>
</body>
<script type="text/javascript" src="../../js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="../../js/mui.js"></script>
<script>
    $(function(){
        $('.mask_layer').height(document.body.scrollHeight+500);
        $('.affirm_submit').bind("tap",function(){
            $('.modal_box').css('display','block');
            $(document.body).css({
                "overflow-x":"hidden",
                "overflow-y":"hidden"
            });
        });
        $('#look_newKeyword').bind("tap",function(){
            $('.modal_box_keyword').css('display','block');
            $(document.body).css({
                "overflow-x":"hidden",
                "overflow-y":"hidden"
            });
        });
        $('.close').bind("tap",function(){
            $('.modal_box,.modal_box_keyword').css('display','none');
            $(document.body).css({
                "overflow-x":"auto",
                "overflow-y":"auto"
            });
        })
    })
</script>
</html>



























